<template lang="">
  <div>
      <van-field label="角色名" placeholder="请输入角色名称" v-model="name"/>
      <van-button @click="add">添加</van-button>
      <br/>
      展示角色列表
      <ul>
          <li v-for="i in rolelist">{{i.name}}
              <router-link :to="{path:'addresource',query:{'id':i.id}}">配置资源</router-link>
          </li>
      </ul>
  </div>
</template>

<script>
export default {
    data(){
        return{
            name:'',
            rolelist:[]
        }
    },
    methods:{
        add(){
            this.axios.post('roleM',{name:this.name}).then(res=>{
                if(res.data.code == 200){
                    alert('添加成功')
                    this.name = ''
                }
            })
        },
        getRoles(){
            this.axios.get('roleM').then(res=>{
                this.rolelist = res.data.list
            })
        }
    },
    mounted() {
        this.getRoles()
    },
}
</script>

<style>

</style>